<template>
  <div class="dt-content-project-list">
    <el-table :data="AuditList" border style="width: 100%" :header-cell-style="headerRowStyle" class="dt-content-project-table">
      <el-table-column type="index" label="序号" width="80"> </el-table-column>
      <el-table-column prop="auditTypeName" label="审批类型" min-width="120"> </el-table-column>
      <el-table-column prop="rootProjectName" label="所属项目" min-width="450">
        <template slot-scope="scope">
          <el-tooltip
            :open-delay="500"
            class="item"
            effect="dark"
            :content="scope.row.rootProjectName"
            placement="top-start"
            :disabled="scope.row.isOverFlow"
          >
            <p class="dt-content-project-list-project" ref="thirdTextContainer">{{ scope.row.rootProjectName }}</p>
          </el-tooltip>
        </template>
      </el-table-column>
      <el-table-column prop="taskName" label="任务名称" min-width="450"> </el-table-column>
      <el-table-column prop="createName" label="发起人" min-width="180"> </el-table-column>
      <el-table-column prop="createTime" label="发起时间" min-width="240"> </el-table-column>
      <el-table-column prop="auditStateName" label="审核状态" min-width="150"> </el-table-column>
      <el-table-column label="操作" min-width="120">
        <template slot-scope="scope">
          <el-badge is-dot class="item" :hidden="!(scope.row.auditState == '1' && scope.row.auditUid == Uid)">
            <el-button @click="goDetail(scope.row)" type="text" size="small">{{ scope.row.auditState == 1 ? '审批' : '查看' }}</el-button>
          </el-badge>
        </template>
      </el-table-column>
    </el-table>
    <div class="dt-content-project-list-page" v-if="TotalRecord > 0">
      <el-pagination
        @current-change="handleCurrentChange"
        :current-page.sync="currentPage"
        :page-size="20"
        layout="prev, pager, next, jumper"
        :total="TotalRecord"
      >
      </el-pagination>
    </div>
  </div>
</template>
<script>
export default {
  props: {
    AuditList: Array,
    TotalRecord: Number,
    TotalPage: Number, // 指定prop为Array类型
    ActiveName: {
      type: [String], // 可以是字符串
      required: true, // 必填项
      default: '0' // 如果没有传递，则使用默认值
    },
    Uid: {
      type: [String], // 可以是字符串
      required: true, // 必填项
      default: '0' // 如果没有传递，则使用默认值
    }
    // ProjectLogList: Array,
    // TotalRecord: Number,
    // TotalPage: Number,
    // LogTotalPage: Number,
    // LogTotalRecord: Number,
    // ActiveName: {
    //   type: [String], // 可以是字符串
    //   required: true, // 必填项
    //   default: '0' // 如果没有传递，则使用默认值
    // }
  },
  data() {
    return {
      currentPage: 1
    }
  },
  methods: {
    headerRowStyle() {
      return {
        'font-size': '14px', // 设置表头字体大小
        'background-color': '#fafafa', // 设置表头背景色
        'font-weight': 'bold', // 设置表头字体加粗
        color: '#909399' // 设置表头字体颜色
      }
    },
    handleCurrentChange(page) {
      this.$emit('TurnPage', page)
    },
    goDetail(row) {
      if (row.auditType == '2') {
        this.$router.push(
          '/main/#/ma?tab=detail&elTab=' +
            this.ActiveName +
            '&taskId=' +
            row.taskId +
            '&auditType=' +
            row.auditType +
            '&taskAuditId=' +
            row.taskAuditId
        )
      } else if (row.auditType == '1') {
        this.$router.push('/main/#/ma?tab=detail&elTab=' + this.ActiveName + '&taskAuditId=' + row.taskAuditId + '&auditType=' + row.auditType)
      }
    },
    setPage(page) {
      this.currentPage = page
    }
  },

  mounted() {}
}
</script>
<style scoped>
.dt-content-project-list {
  /* margin: 16px; */
  padding: 14px 14px 0 14px;
  background-color: #fff;
  flex: 1;
  position: relative;
}
.dt-content-project-list-project {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.dt-content-project-list-page {
  /* display: flex;
  justify-content: center; */
  /* padding: 40px 0 20px 0; */
  position: absolute;
  bottom: 14px;
  left: 50%;
  transform: translateX(-50%);
}
::v-deep .el-badge__content.is-fixed {
  top: 10px;
}

.dt-content-project-list >>> .el-table__cell {
  padding: 8px 0;
}
.dt-content-project-list >>> .el-table__row .el-table__cell {
  padding: 3.5px 0;
}
.dt-content-project-table >>> tbody tr.el-table__row td.el-table__cell div.cell {
  color: #1f1f1f;
}
.dt-content-project-table >>> tbody tr.el-table__row td.el-table__cell div.cell .el-button {
  font-size: 14px;
}
/* .dt-content-project-list-header {
      background-color: #fafafa;
      font-size: 14px;
      font-weight: bold;
      color: #909399;
    } */
</style>
